<!-- 招商合作 -->
<template>
    <div>
        <a-card title="" :bordered="false">
            <a-button type="primary" @click="addProgress">
                <a-icon type="plus"/>
                新增进度
            </a-button>
            <div v-if="editState">
                <add-project-progress
                    @saveSuccess="progressSaveSuccess"
                    :totalData="totalData"
                    :projectName="p.name"
                    :projectNumber="p.project_number"></add-project-progress>
            </div>
            <div v-else>
                <project-progress-detail :data="progressListData"></project-progress-detail>
            </div>
        
        </a-card>
        <!--         fixed footer toolbar -->
    
    </div>
</template>

<script>

    import indexedDB from '@/db/db'
    import moment from 'moment'
    import AddProjectProgress from './AddProjectProgress'
    import ProjectProgressDetail from './ProjectProgressDetail'

    export default {
        name: "DevelementPlans",
        components: {
            AddProjectProgress,
            ProjectProgressDetail,
        },
        data() {
            return {
                editState: false,
                p: [],
                progressListData: [],
                totalData: {
                    yearsTotal: 0,
                    projectTotal: 0,
                    lastYearTotal: 0,
                    yearsTotalLastMonth: 0,
                },
            }
        },
        mounted() {
            let id = this.$route.query.objId
            this.getProjectDetail(parseInt(id))
        },
        methods: {
            getProjectDetail(id) {
                indexedDB.get({name: 'project'}, id).then(res => {
                    console.log(res)
                    if (res.length > 0) {
                        this.p = res[0]
                        
                        this.getProgress()
                    }

                })
            },
            addProgress() {
                this.editState = true
            },
            progressSaveSuccess() {
                this.getProgress()
            },
            getProgress() {
                let kRound = IDBKeyRange.only(this.p.project_number)
                indexedDB.handleDataByIndex('projectProgress', kRound, 'project_number').then(res => {
                    console.log(res)
                    if (res.length > 0) {
                        this.progressListData = res
                        this.progressListData.forEach(item=>{
                            item.files.forEach((subItem)=>{
                                subItem.url = URL.createObjectURL(subItem.originFileObj)
                            })
                        })
                        
                        this.editState = false
                        this.computerInvestmentTotal()
                    }

                })
            },
            computerInvestmentTotal() {
                if (this.progressListData.length > 0) {
                    let year = moment().format('YYYY')
                    let lastYear = moment().subtract(1, 'year').format('YYYY')
                    let month = moment().format('MM')
                    let yearsTotalData = this.progressListData.filter(item => item.year === year)
                    let lastYearsTotalData = this.progressListData.filter(item => item.year === lastYear)
                    yearsTotalData.forEach(item => {
                        this.totalData.yearsTotal += Number(item.investment_month_total)
                        if(item.month < month) {
                            this.totalData.yearsTotalLastMonth += Number(item.investment_month_total)
                        }
                    })
                    lastYearsTotalData.forEach(item => {
                        this.totalData.lastYearsTotal += Number(item.investment_month_total)
                    })
                    this.progressListData.forEach(item => {
                        this.totalData.projectTotal += Number(item.investment_month_total)
                    })
                }
            },


        },
    }
</script>

<style lang="scss" scoped>
    .card {
        margin-bottom: 24px;
    }
    
    .title {
        font-size: 20px;
        line-height: 28px;
        font-weight: 500;
        color: rgba(0, 0, 0, 0.85);
        margin: 16px 0 30px 0;
    }
</style>